<template>
  <div>
    <h1>App</h1>

    <button @click="cname = TsName">TsName</button>
    <button @click="cname = TsAge">TsAge</button>
    <button @click="cname = TsHobby">TsHobby</button>
    <KeepAlive>
      <component :is="cname"></component>
    </KeepAlive>
  </div>
</template>
<script setup>
import { ref } from 'vue';
import TsName from './TsName.vue';
import TsAge from './TsAge.vue';
import TsHobby from './TsHobby.vue';
const cname = ref(TsName);
</script>

<style>
div {
  border: solid;
  padding: 10px;
}
</style>